
let questionApp=new Vue({
    el:"#questionApp",
    data:{
        question:{}
    },
    methods:{
        loadQuestion:function(){
            // 从url?之后获取值
            let qid=location.search;
            //  如果qid不存在
            if(!qid){
                alert("必须指定问题的id");
                return;
            }
            //如果qid有值需要去掉?    ?150   ->   150
            qid=qid.substring(1);
            //通过axios请求获得当前问题详情
            axios({
                //   /v1/questions/150
                url:"/v1/questions/"+qid,
                method:"get"
            }).then(function(response){
                questionApp.question=response.data;
                questionApp.updateDuration();
            })
        },
        deleteQuestion: function (){
            let qid = location.search;
            if (!qid){
                alert("删除失败")
               return;
            }
            qid=qid.substring(1);
            axios({
                url:"/v1/questions/delete/"+qid,
                method:"post"
            }).then(function (response){
                if (response.data == "删除成功"){
                    location.href="/index_student.html"
                    alert(response.data);
                }else {
                    alert(response.data)
                }
            })
        },
        updateDuration:function(){
            //创建问题时候的时间毫秒数
            let createtime = new Date(this.question.createtime).getTime();
            //当前时间毫秒数
            let now = new Date().getTime();
            let duration = now - createtime;
            if (duration < 1000*60){ //一分钟以内
                this.question.duration = "刚刚";
            }else if(duration < 1000*60*60){ //一小时以内
                this.question.duration = (duration/1000/60).toFixed(0)+"分钟以前";
            }else if (duration < 1000*60*60*24){
                this.question.duration = (duration/1000/60/60).toFixed(0)+"小时以前";
            }else if (duration < 1000*60*60*24*30){
                this.question.duration=(duration/1000/60/60/24).toFixed(0)+"天以前";
            }else {
                this.question.duration=(duration/1000/60/60/24/30).toFixed(0)+"月以前";
            }
        }
    },
    created:function(){
        //页面加载完毕后调用显示问题详情的方法
        this.loadQuestion();
    }
})

let postAnswerApp=new Vue({
    el:"#postAnswerApp",
    data:{
        hasError:false,
        message:""
    },
    methods: {
        postAnswer:function(){
            let qid=location.search;
            if(!qid){
                this.hasError=true;
                this.message="必须指定问题id";
                return;
            }
            // 去掉qid第一位的?   "?150">"150"
            qid=qid.substring(1);
            let content=$("#summernote").val();
            if(!content){
                this.hasError=true;
                this.message="必须填写回答内容";
                return;
            }
            let form=new FormData();
            form.append("questionId",qid)
            form.append("content",content);
            axios({
                url:"/v1/answers",
                method:"post",
                data:form
            }).then(function(response){
                if(typeof(response.data)=="object"){
                    postAnswerApp.hasError=true;
                    postAnswerApp.message="提交完成";
                    // 重置summernote
                    $("#summernote").summernote("reset");
                    //将提交成功的回答追加到回答列表中
                    answersApp.answers.push(response.data);
                    response.data.duration="刚刚";
                }else {
                    postAnswerApp.hasError = true;
                    postAnswerApp.message = response.data;
                }
            })

        }
    }
})


let answersApp=new Vue({
    el:"#answersApp",
    data:{
        answers:[]
    },
    methods:{
        loadAnswers:function(){
            let qid=location.search;
            if(!qid){
                alert("必须指定问题id");
                return;
            }
            qid=qid.substring(1);
            axios({
                url:"/v1/answers/question/"+qid,
                method:"get"
            }).then(function(response){
                answersApp.answers=response.data;
                for(let i=0;i<answersApp.answers.length;i++){
                    addDuration(answersApp.answers[i]);
                }
            })
        },
        postComment:function(answerId){
            if(!answerId){
                return
            }
            console.log(answerId);
            // 获得输入框对象
            let textarea=$("#addComment"+answerId+" textarea");
            let content=textarea.val();
            if(!content){
                alert("必须编写评论内容");
                return;
            }
            let form=new FormData();
            form.append("answerId",answerId);
            form.append("content",content);
            axios({
                url:"/v1/comments",
                method:"post",
                data:form
            }).then(function(response){
                console.log(response.data);
                // 用户新增的评论
                let comment=response.data;
                // 问题的所有回复
                let answers=answersApp.answers;
                console.log(answers);
                //遍历当前所有的回答对象
                for(let i=0;i<answers.length;i++){
                    if(answers[i].id == answerId ){
                        answers[i].comments.push(comment);
                        break;
                    }
                }
                // 清空文本域中的内容
                textarea.val("");
            })
        },
        removeComment:function(commentId,index,answer){
            axios({
                url:"/v1/comments/remove/"+commentId,
                method:"post"
            }).then(function(response){
                console.log(response.data);
                if(response.data=="删除成功") {
                    // js代码删除数组中元素的方法splice([删除的索引值],[删除几个])
                    answer.comments.splice(index, 1);
                }
            })
        },
        updateComment:function(commentId,answerId,index,answer){
            let textarea=$("#editComment"+commentId+" textarea");
            let content=textarea.val();
            let form=new FormData();
            form.append("answerId",answerId);
            form.append("content",content);
            axios({
                url:"/v1/comments/update/"+commentId,
                method:"post",
                data:form
            }).then(function(response){
                //将要修改的评论重新赋值对象
                //answer.comments[index]=response.data;
                //上面的修改并不会引发vue对页面的刷新
                //也就是说,数组中的数据已经发生了变化,但是页面中数据不变
                // 是因为Vue不会对当前绑定数组中元素的子元素进行修改时自动刷新
                // 所以,想修改数据还想让页面刷新,需要使用下面的命令
                Vue.set(answer.comments,index,response.data);
                //Vue.set([修改哪个数组],[修改哪个索引],[修改成什么])
                $("#editComment"+commentId).collapse("hide");
            })
            //  ["red","black","blue","white"]
        },
        answerSolved:function(answerId){
            axios({
                url:"/v1/answers/solved/"+answerId,
                method:"get"
            }).then(function(response){
                alert(response.data);
            })
        }
    },
   created : function(){
        this.loadAnswers();
   }

})



